<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"  %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>代理商管理系统</title>
    <link rel="stylesheet" href="${ctx }/static/layui/css/layui.css">
    <script src="${ctx }/static/js/jquery.js"></script>
    <style>

        #div1 {
            width: 1600px;
            height: 105px;
            opacity:0.7;
            background-image: url("${ctx}/static/images/u1.png");
	
        }
         #div2 {
         	position:absolute;
         	top:0px;
         	right:0px;
            margin-right:0px;

        }
        h1{
            margin: 0 auto;
            padding-top: 30px;
            padding-left: 200px;
            font:'幼圆';
        }
        #ff{
            -webkit-transform: scaleY(-1);
            -moz-transform: scaleY(-1);
            -ms-transform: scaleY(-1);
            -o-transform: scaleY(-1);
            transform: scaleY(-1);
            opacity:0.5;
        }
        
/*         关键词申请 */
		.custDiv{
			width:510px;border: 1px solid;
			position:absolute;left: 130px;z-index: 2;
			background-color: white;
			display: none;
		}
		.keyWord{
			border: 1px solid;margin-top: 20px;
		}
		.keyWord form{
			margin-top: 20px;
		}
		.keyWord .layui-input,input[name=search]{
			width:500px;
			height:30px;
			display: inline-block;
		}
		
		
		#custlist{
		
			float:left;border:1px solid;width:100px;height:50px;
			cursor:pointer;
		}
		.keywordBtn{
			margin-left:20px;
			margin-bottom:20px;
		}
/* 查看客户信息 */
	#left{
		width:400px;
		height:50px;
  		float:left;
  		margin-left:100px;
  		margin-top:20px;
  		clear: both;
	}
	#right{
		width:400px;
		height:50px;
		margin-left:800px;
		margin-right:400px;
		margin-top:20px;
	}
	#changeDiv{
		
		margin-left:100px;
	}	
	p{
		line-height: 30px;
	}	
	#contact{
		width:400px;
		margin-left:100px;
  		margin-top:20px;
		display: inline-block;
	}
	#goBackBtn{
		
		background-image: url("${ctx}/static/images/back.png");
		width:65px;
		height:30px;
	}
	#saveBtn{
		margin-left:500px;
		background-image: url("${ctx}/static/images/save.png");
		width:65px;
		height:30px;
	}
    </style>
</head>
<body>

	<div>
	    <div id="div1">
		    <h1>代理商管理系统</h1><h1 id="ff">代理商管理系统</h1>
		    <div id="div2">欢迎您：${user.loginName} <a href="#" onclick="changed()">修改密码</a> <a href="${ctx }/user/logout">退出</a></div>
	     	<input id ="agent1"  type="hidden" value="${user.loginName}">
	    </div>
	    <div class="layui-tab" style="margin: 0">
	            <ul class="layui-tab-title" style="background-color: #0C87B8">
	            <li class="layui-this">代理商管理</li>
	            <li>门户管理</li>
	            <li>报表管理</li>
	            <li>系统管理</li>
	            <li>系统配置管理</li>
	        </ul>
	        <div class="layui-tab-content">
	            <div class="layui-tab-item layui-show">
	            
	
	                    <a href="#" onclick="keyWord()">关键词申请|</a>
	                    <a href="${ctx }/custom/likeSearch?companyName=&agent=${user.loginName}" >代理商客户管理|</a>
	                    <a href="#">代理商预付款|</a>
	                    <a href="${ctx }/keyWord/likeSearch?keyWord=">关键词申请管理|</a>
	                    <a href="#">操作日志</a>
	
	            </div>
	            <div class="layui-tab-item">
	                <a href="#">门户管理</a>
	            </div>
	            <div class="layui-tab-item">
	                <a href="#">报表管理</a>
	
	            </div>
	            <div class="layui-tab-item">
	                <a href="#">财务管理|</a>
	                <a href="#">角色管理|</a>
	                <a href="#">角色权限配置|</a>
	                <a href="#">用户管理|</a>
	                <a href="#">关键词审核</a>
	            </div>
	
	            <div class="layui-tab-item">
	                <a href="#">财务类型|</a>
	                <a href="#">服务类型|</a>
	                <a href="#">服务年限|</a>
	                <a href="#">APP地址|</a>
	                <a href="#">客户类型|</a>
	                <a href="#">证件类型|</a>
	                <a href="#">优惠类型</a>
	            </div>
	        </div>
	    </div>
	    <div id="changeDiv">
	    	<form id="custForm" action="${ctx }/custom/Alter" method="post">
    			<input type="hidden" name="custId" value="${cust.id }">
    			<h6>基本信息</h6>
		    	<div style="width:1200px;height:100px;border: 1px solid;">
		    		<div id="left">
		    			<p>企业名称：<input type="text" name="companyName" value="${cust.companyName }"><span id="companyName" style="color: red">*</span></p>
		    			<p>状态：
		    				<select name="state">
		    					<option>启用</option>
		    					<option>停用</option>
		    				</select>
		    			</p>
		    		</div>
		    		<div id="right">
		    			<p>企业类型：
		    				<select name="companyType">
		    						<option selected="selected" value="${cust.companyType }">${cust.companyType }</option>
		    				</select>
		    				<span id="companyType" style="color: red">*</span>
		    			</p>
		    			<p>企业主页：<input type="text" name="companyIndex " value="${cust.companyIndex }" > </p>
		    		</div>
		    		 
		    	</div>
	    		<h6>门户信息</h6>	
	    		<div style="width:1200px;height:300px;border: 1px solid;">
	    		
		    		<div id="left">
		    			<p>法人代表：<input type="text" name="legalPerson" value="${cust.legalPerson }"><span id="legalPerson" style="color: red">*</span></p>
		    			<p>证件类型：
		    				<select name="cardType">
		    						<option selected="selected" value="${cust.cardType} ">${cust.cardType }</option>
		    				</select>
		    				<span id="cardType" style="color: red">*</span>
		    			</p>
		    			<p>国家：<input type="text" name="country" value="${cust.country }" ></p>
		    			<p>公司传真：<input type="text" name="companyFax" value="${cust.companyFax }"></p>
		    			<p>公司电话：<input type="text" name="companyPhone" value="${cust.companyPhone}"><span id="companyPhone" style="color: red">*</span></p>
		    			<p>公司地址：<input type="text" name="adress" value="${cust.adress}"></p>
		    			备注：<textarea rows="2" cols="100" name="remark" >${cust.remark }</textarea>
		    		</div>
		    		<div id="right">
		    			<p>注册日期：<input type="text" name="registeDate" value='<fmt:formatDate value="${cust.registeDate }"/>'></p>
		    			<p>证件号码：<input type="text" name="cardId" value="${cust.cardId }"><span id="cardId" style="color: red">*</span> </p>
		    			<p>省/地区：<select name="province" id="province">
									<option selected="selected">${cust.province } </option>
								</select>
								<span id="pe" style="color: red">*</span>
						</p>
		    			<p>城市：
		    				<select name="city" id="city">
								<option selected="selected">${cust.city } </option>
							</select>
							<span id="ct" style="color: red">*</span>
		    			</p>
		    			<p>区：${cust.street }
		    				<select name="street" id="street">
								<option selected="selected">${cust.street } </option>
							</select>
							<span id="st" style="color: red">*</span>
		    			</p>
	    			</div>
	    		</div>
	    	</form>
	    		
	    	<h6><a href="#" id="addContact">添加一个联系人</a></h6>
	    	
	    		<div style="width:1200px;height:auto; border: 1px solid;">
	    			
	    			<form id="contactForm" action="${ctx }/contact/alter/${user.loginName}" method="post">
	    				<input type="hidden" name="cust.id" value="${cust.id }">
	    				<table cellspacing="0" border="1" style="margin-left: 100px">
<%-- 		    				<c:if test="${not empty cl }"> --%>
		    				<thead>
		    					<tr>
		    						<td>姓名</td>
		    						<td>电话</td>
		    						<td>手机</td>
		    						<td>传真</td>
		    						<td>邮箱</td>
		    						<td>职务</td>
		    						<td>操作</td>
		    					
		    					</tr>
		    				</thead>
<%-- 		    				</c:if> --%>
		    				<tbody  id="tb">
		    					<c:forEach items="${cl }" var="obj" varStatus="i" >
			    					<tr>
			    						<td style="display:none"><input type="hidden" name="lists[${i.index }].cust.id" value="${cust.id }"></td>
			    						<td style="display:none"><input type="hidden" name="lists[${i.index }].id" value="${obj.id }"></td>
			    						<td><input type="text" name="lists[${i.index }].contactName" value="${obj.contactName }" required="required"><span id="contactName" style="color: red">*</span></td>
			    						<td><input type="text" name="lists[${i.index }].contactPhone" value="${obj.contactPhone}" required="required"><span id="contactPhone" style="color: red">*</span></td>
			    						<td><input type="text" name="lists[${i.index }].mobilePhone" value="${obj.mobilePhone }" required="required"><span id="mobilePhone" style="color: red">*</span></td>
			    						<td><input type="text" name="lists[${i.index }].contactFax" value="${obj.contactFax }"></td>
			    						<td><input type="text" name="lists[${i.index }].contactMail" value="${obj.contactMail }"required="required"><span id="contactMail" style="color: red">*</span></td>
			    						<td><input type="text" name="lists[${i.index }].contactPosition" value="${obj.contactPosition }" required="required"><span id="contactPosition" style="color: red">*</span></td>
			    						<td><a href="${ctx }/contact/delete/${obj.id }?cid=${cust.id }">删除</a></td>
		    						</tr>
	    						</c:forEach>
		    				
		    				</tbody>
		    			</table>
	    			</form>
	    			
		    	</div>
	    		
	    	<button id="saveBtn" ></button>
	    	<button onclick="window.history.go(-1)" id="goBackBtn" ></button>
	    </div>
	</div>
	
</body>
<script src="${ctx }/static/layui/layui.all.js"></script>
<script>
	function changed(){
		$("#changeDiv").load("${ctx}/pages/changePassword.jsp");
	}
		
	function keyWord(){
		$("#changeDiv").load("${ctx}/pages/keyWord.jsp");
	
	}
	
	
// 	省市级联

	$(document).ready(function(){
		
		var arr_provinces =  ['湖南省','广东省','河北省'];
		var arr_citys = [
							['娄底','长沙','株洲'],
							['深圳','广州','东莞'],
							['石家庄','秦皇岛','唐山']
						];

		var arr_zones = [
							[['涟源','新化'],['雨花区','马兰山'],['株洲1','株洲二']],
							[['福田','龙岗','罗湖','龙华'],['广州组织','番禺区','广州南'],['东莞噶']],
							[['石门'],['求仙岛'],['唐门..']]
						];


		// 给省添加点击事件

        $("#province").click(function(){
        	$("#province").html("");
            for(var i = 0;i <arr_provinces.length;i++){
                var op = $("<option></option>");

                op.val(arr_provinces[i]);
                op.html(arr_provinces[i]);
                $("#province").append(op);
            }
            $("#province").unbind("click");
        });
        var index;
        $("#province").change(function(){
            for(var i = 0;i<arr_provinces.length;i++) {
                if ($("#province").val()==arr_provinces[i]) {
                    index = i;
                    break;
                }
            }

            $("#city").html("");
            for(var i = 0;i<arr_citys[index].length;i++){
                var op1 = $("<option></option>");
                op1.val(arr_citys[index][i]);
                op1.html(arr_citys[index][i]);
                $("#city").append(op1);
            }
            town();
        });

        $("#city").change(function(){
          town()

        });

        function town() {
            var num;
            for(var i = 0;i<arr_citys[index].length;i++) {
                if ($("#city").val()==arr_citys[index][i]) {
                    num = i;
                    break;
                }
            }
            $("#street").html("");
            for(var i = 0;i<arr_citys[index].length;i++){
                var op2 = $("<option></option>");
                op2.val(arr_zones[index][num][i]);
                op2.html(arr_zones[index][num][i]);
                $("#street").append(op2);
            }
        }

        //企业类型查询
        $.ajax({
			url:"${ctx}/companyType/type",
			type:"post",
			success:function(data){
				var op = data;
				var html = '<option></option>';
				for(var i=0;i<op.length;i++){
					html+="<option value="+op[i].type+">"+op[i].type+"</option>";
				}
				$("select[name=companyType]").html(html);
			}
		})
		
		//证件类型查询
		$.ajax({
			url:"${ctx}/cardType/type",
			type:"post",
			success:function(data){
				var op = data;
				var html = '<option></option>';
				for(var i=0;i<op.length;i++){
					html+="<option value="+op[i].type+">"+op[i].type+"</option>";
				}
				$("select[name=cardType]").html(html);
			}
		})
		
		var c= $('#tb tr').length-1;
        
		$("#addContact").click(function(){
			
			c++;
	
 			
 			$("tbody").append("<tr>\n"
 					
 					+"<td><input type='text' name='lists["+c+"].contactName' required='required'><span id='contactName' style='color: red'>*</span></td>\n"
 					+"<td><input type='text' name='lists["+c+"].contactPhone' required='required'><span id='contactName' style='color: red'>*</span></td>\n"
 					+"<td><input type='text' name='lists["+c+"].mobilePhone' required='required'><span id='contactName' style='color: red'>*</span></td>\n"
 					+"<td><input type='text' name='lists["+c+"].contactFax' required='required'><span id='contactName' style='color: red'>*</span></td>\n"
 					+"<td><input type='text' name='lists["+c+"].contactMail' required='required'><span id='contactName' style='color: red'>*</span></td>\n"
 					+"<td><input type='text' name='lists["+c+"].contactPosition' required='required'><span id='contactName' style='color: red'>*</span></td>\n"
 					+"<td><a href='${ctx }/contact/delete/${obj.id }?cid=${cust.id }'>删除</a></td>\n"
 					+"<td><input type='hidden' name='lists["+c+"].cust.id' value='${cust.id }' required='required'><span id='contactName' style='color: red'>*</span></td>\n"
				+"<tr>") 


			
		}) 
        
	})
	$("#saveBtn").click(function(){
		var id = $("input[name=custId]").val();
		
		var companyName = $("input[name=companyName]").val();
		
		var companyType = $("select[name=companyType]").val();
		
		var legalPerson = $("input[name=legalPerson]").val();
		
		var companyPhone = $("input[name=companyPhone]").val();
		
		var cardId = $("input[name=cardId]").val();
		
		var province= $("#province").val();
		
		var cardType = $("select[name=cardType]").val();
		
		var city= $("#city").val();
		
		var street= $("#street").val();
		
		var contactName = $("input[name=contactName]").val();
		
		var contactPhone = $("input[name=contactPhone]").val();
		
		var mobilePhone = $("input[name=mobilePhone]").val();
		
		var contactMail = $("input[name=contactMail]").val();
		
		var contactPosition = $("input[name=contactPosition]").val();
		
		if(companyName==""||companyName==null){
			$("#companyName").html("客户名称不能为空")
			return;
		}else{
			$("#companyName").html("*")
		}
		if(companyType==""||companyType==null){
			$("#companyType").html("类型不能为空")
			return;
		}else{
			$("#companyType").html("*")
		}
		if(companyPhone==""||companyPhone==null){
			$("#companyPhone").html("电话不能为空")
			return;
		}else{
			$("#companyPhone").html("*")
		}
		if(legalPerson==""||legalPerson==null){
			$("#legalPerson").html("法人不能为空")
			return;
		}else{
			$("#legalPerson").html("*")
		}
		if(cardType==""||cardType==null){
			$("#cardType").html("证件类型不能为空")
			return;
		}else{
			$("#cardType").html("*")
		}
		if(cardId==""||cardId==null){
			$("#cardId").html("证件号不能为空")
			return;
		}else{
			$("#cardId").html("*")
		}
		if(province==""||province==null){
			$("pe").html("省份不能为空")
			return;
		}else{
			$("#pe").html("*")
		}
		if(city==""||city==null){
			$("#ct").html("城市不能为空")
			return;
		}else{
			$("#ct").html("*")
		}
		if(street==""||street==null){
			$("#st").html("街道不能为空")
			return;
		}else{
			$("#st").html("*")
		}
// 		if(contactName==""||contactName==null){
// 			$("#contactName").html("联系人名称不能为空")
// 			return;
// 		}else{
// 			$("#contactName").html("*")
// 		}
// 		if(contactPhone==""||contactPhone==null){
// 			$("#contactPhone").html("联系人电话不能为空")
// 			return;
// 		}else{
// 			$("#contactPhone").html("*")
// 		}
// 		if(mobilePhone==""||mobilePhone==null){
// 			$("#mobilePhone").html("手机号不能为空")
// 			return;
// 		}else{
// 			$("#mobilePhone").html("*")
// 		}
// 		if(contactPosition==""||contactPosition==null){
// 			$("#contactPosition").html("职位不能为空")
// 			return;
// 		}else{
// 			$("#contactPosition").html("*")
// 		}
		
		var state = $("select[name=state]").val();
		
		var companyIndex = $("input[name=companyIndex]").val();
		
		var country = $("input[name=country]").val();
		
		var registeDate = $("input[name=registeDate]").val();
		
		var remark = $("textarea[name=remark]").val();
		
		var adress = $("input[name=adress]").val();
		
		var companyFax = $("input[name=companyFax]").val();
		
		
		var cust = {
				id:id,
				companyName:companyName,
				state:state,
				companyIndex:companyIndex,
				country:country,
				registeDate:registeDate,
				remark:remark,
				adress:adress,
				companyFax:companyFax,
				companyType:companyType,
				legalPerson:legalPerson,
				companyPhone:companyPhone,
				cardId:cardId,
				province:province,
				cardType:cardType,
				city:city,
				street:street
		};
	
		$.ajax({
			 url:'${ctx}/custom/Alter',
	            data:cust,
	            type:'post',
	            success:function(data){
	                if(data.code=='1'){
	                	
	                
	                	$("#contactForm").submit();
	                	
	                	console.log('添加成功')
	                }else{
	                    console.log('添加失败')
	                }
	            }
			
		})
		
	})
	
	
</script>
</html>

























